<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>
<body>
  
</body>
</html>
<!-- 
  在CSS中，单位可以分为相对单位和绝对单位。这两种类型的单位用于指定长度、时间、角度等属性的值。

### 相对单位：
1. **百分比（%）：**
   - **用途：** 相对于父元素的相应属性值。
   - **示例：** `width: 50%;` 表示元素的宽度为父元素宽度的50%。
2. **em：**
   - **用途：** 相对于元素自身的字体大小。
   - **示例：** `font-size: 1.5em;` 表示字体大小为父元素字体大小的1.5倍。
3. **rem：**
   - **用途：** 相对于根元素（html元素）的字体大小。
   - **示例：** `font-size: 2rem;` 表示字体大小为根元素字体大小的2倍。
4. **vw（视口宽度的百分比）：**
   - **用途：** 相对于视口宽度的百分比。
   - **示例：** `width: 50vw;` 表示元素宽度为视口宽度的50%。
5. **vh（视口高度的百分比）：**
   - **用途：** 相对于视口高度的百分比。
   - **示例：** `height: 30vh;` 表示元素高度为视口高度的30%。
6. **vmin（vw和vh中较小的那个）：**
   - **用途：** 相对于vw和vh中较小的那个的百分比。
   - **示例：** `font-size: 2vmin;` 表示字体大小为vw和vh中较小的那个的2倍。
7. **vmax（vw和vh中较大的那个）：**
   - **用途：** 相对于vw和vh中较大的那个的百分比。
   - **示例：** `margin: 2vmax;` 表示外边距为vw和vh中较大的那个的2倍。

### 绝对单位：
1. **像素（px）：**
   - **用途：** 绝对长度单位，通常在屏幕上使用，表示屏幕上的一个像素。
2. **英寸（in）：**
   - **用途：** 绝对长度单位，1英寸等于2.54厘米。
3. **厘米（cm）：**
   - **用途：** 绝对长度单位。
4. **毫米（mm）：**
   - **用途：** 绝对长度单位。
5. **磅（pt）：**
   - **用途：** 绝对长度单位，1磅等于1/72英寸。
6. **pc（pica，12磅为1pc）：**
   - **用途：** 绝对长度单位，1pc等于12磅。

### 注意事项：

- 相对单位相对于其他值，可能更灵活适应不同设备和屏幕尺寸。
- 绝对单位提供了更明确的物理尺寸，但在不同设备上可能会有不同的显示效果。
- 选择使用相对单位还是绝对单位取决于设计的需求和具体的使用场景。
 -->